{% extends 'layout/basic.html' %}

{% block title %}用户登录{% endblock %}

{% block content %}

    <div style="margin: 80px auto; width: 300px;">
        <form action="{% url 'login' %}" method="post">
            {% csrf_token %}
            <h1 style="text-align: center">登录</h1>
            {% for field in form %}

                {% if field.name == "img_code" %}
                    <div>
                        <div class="col-lg-6">
                            <label for="exampleInputEmail1">{{ field.label }}</label>
                            <div class="row">
                               {{ field }}
                                <span style="color: red" class="error-msg">{{ field.errors.0 }}</span>
                            </div>
                        </div>
                        <div class="col-lg-6">
                            <div class="row">
                            <label for="exampleInputEmail1">图片</label>
                            <img src="{% url 'img_code' %}" id="imgcode" alt="" title="点击更换图片">
                            </div>
                        </div>
                    </div>

                {% else %}

                <div class="form-group">
                    <lable for="{{ field.id_for_label }}">{{ field.label }}</lable>
                    {{ field }}
                    <span style="color: red" class="error-msg">{{ field.errors.0 }}</span>
                </div>

                {% endif %}
            {% endfor %}

            <div style="margin-top: 90px">
                <input type="submit" value="登录">
            </div>

        </form>
    </div>>
{% endblock %}

{% block js %}

    <script>
        $(function () {
            $('#imgcode').click(function () {
                var oldSrc = $(this).attr('src');
                $(this).attr('src',oldSrc + '?');
            })
        })
    </script>

{% endblock %}